<template>
    <div class="gold-shop-wrap">
        <van-nav-bar :title="transfer.title" left-arrow fixed @click-left="onClickLeft" right-text="转账记录" @click-right="onClickRight"/>
        <van-field class="input_field" v-model="target_id" name="target_id" label="" placeholder="请输入对方手机号或ID" />
        <div class="tip">转账将实时到账，请确认对方信息后再进行转账!</div>
        <van-button round block type="info"
      style="width: 80%;margin: 1rem auto 0.56rem auto" color="linear-gradient(to right, #FF5851, #E9011B)"
      @click="onSubmit">下一步</van-button>
    </div>
</template>
<script>
import { TRANSFER_SEARCH} from '@/api/mine'
export default {
    data() {
        return {
            transfer: {},
            target_id: ''
        };
    },
    mounted() {
        this.transfer = JSON.parse(localStorage.getItem('transfer'))
        document.title = this.transfer.title;
        window.scrollTo(0, 0)
    },
    methods: {
        onClickLeft() {
            this.$router.back();
        },
        onClickRight(){
            this.$router.push({name:'transferRecord'})
        },
        onSubmit() {
            if (this.target_id=='') {
                this.$toast('请输入对方手机号或ID')
                return;
            }
            this.$http.get(TRANSFER_SEARCH,{params:{key:this.target_id}}).then(res=>{
                let params = {
                ... this.transfer,
                target_id: this.target_id,
                name:res.data.name,
                avatar_url:res.data.avatar_url,
                uid:res.data.uid,
                account:res.data.account
            }
            localStorage.setItem('transfer',JSON.stringify(params))
            this.$router.push({path: "/accountItem"});
            })


        },
    },
};
</script>
<style lang="scss" scoped>
.gold-shop-wrap {
    //   min-height: 100vh;
    min-height: calc(100vh - 46px);

    padding-top: 46px;
    // background: #f2f4f5;

    ::v-deep .van-nav-bar .van-icon {
        color: #333333;
    }

    ::v-deep .van-nav-bar__arrow {
        font-size: 20px;
    }
    ::v-deep .van-nav-bar__text {
    color: #333333;
  }

    .input_field {
        width: 90%;
        margin: .2rem auto;
        border-radius: 8px;
        background: #F2F4F5;
    }

    .tip {
        width: 90%;
        margin: 0 auto;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: .24rem;
        color: #F32A23;
        // line-height: 17px;
        text-align: left;
        font-style: normal;
    }
}
</style>
